<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>过滤器选择器</title>
</head>
<body>
<div>div1</div>
<div id="div2">div2</div>
<div>div3</div>
<div>div4</div>
</body>
<script src="js/jquery-3.3.1.min.js"></script>
<script>
    //首元素选择器
    let div1 = $("div:first");
    // alert(div1.html());

    //尾元素选择器
    let div4 = $("div:last");
    // alert(div4.html());

    //非元素选择器
    let divs1 = $("div:not(#div2)");
    // alert(divs1);

    //偶数选择器
    let divs2 = $("div:even");
    //alert(divs2.length);
    // alert(divs2[0].innerHTML);
    //alert(divs2[1].innerHTML);

    //奇数选择器
    let divs3 = $("div:odd");
    //alert(divs3.length);
    //alert(divs3[0].innerHTML);
    //alert(divs3[1].innerHTML);

    //等于索引选择器
    //let divs4 = $("div:eq(2)");
    // alert(divs4.html());

    //大于索引选择器
    let divs5 = $("div:gt(1)");
    // alert(divs5.length);
    //alert(divs5[0].innerHTML);
    //alert(divs5[1].innerHTML);

    //小于索引选择器
    let divs6 = $("div:lt(2)");
    alert(divs6.length);
    alert(divs6[0].innerHTML);
    alert(divs6[1].innerHTML);
</script>
</html>